@import './lib/reset.scss';

html, body, .container {
    @include rect(100%, 100%); // 宽为100%, 高为100%
}
.container{
    @include flexbox();
    @include flex-direction(column);
    
    .box{
        overflow: scroll;
        @include flex(); // flex:1 以及兼容写法
        @include rect(100%, auto);
        @include flexbox(); // display:flex以及它的兼容写法
        @include flex-direction(column); // flex-direction: column 以及兼容写法
        .header{
            @include rect(100%, 0.44rem);
            @include background-color(#fff)         
        }
        .content{
            @include flex();
            @include rect(100%, auto);
            @include overflow();
        }
    }
    .footer{
        @include rect(100%, 0.5rem);
        @include border(1px 0 0 0, #ccc, solid);
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #ffffff;
    }
}

.fade-enter, .fade-leave-to {
  opacity: 0;
}
.fade-enter-active {
  transition: all .5s;
}
.fade-enter-to, .fade-leave {
  opacity: 1;
}
.fade-leave-active {
  transition: all 0s;
}